/**
 * 布局可见性控制 Composable
 * 统一管理不同布局下组件的显示/隐藏逻辑
 */
import { computed } from "vue";
import { storeToRefs } from "pinia";
import { useAppSettings } from "@/Stores/appSettings";

/**
 * 使用头部可见性
 * @param {Object} props - 组件 props
 * @returns {Object} { isHidden }
 */
export function useHeaderVisibility(props) {
  const { systemTheme } = storeToRefs(useAppSettings());

  const isHidden = computed(() => {
    const layout = systemTheme.value.layout;

    if (props.isTopNav) {
      // 顶部导航：只在 horizontal 和 classic 布局显示
      return layout !== "horizontal" && layout !== "classic";
    } else {
      // 非顶部导航：只在 default 和 columns 布局显示
      return layout !== "default" && layout !== "columns";
    }
  });

  return { isHidden };
}

/**
 * 使用侧边栏可见性
 * @returns {Object} { isHidden }
 */
export function useAsideVisibility() {
  const { systemTheme } = storeToRefs(useAppSettings());

  const isHidden = computed(() => {
    return systemTheme.value.layout === "horizontal";
  });

  return { isHidden };
}

/**
 * 使用分栏可见性
 * @returns {Object} { isHidden }
 */
export function useColumnsVisibility() {
  const { systemTheme } = storeToRefs(useAppSettings());

  const isHidden = computed(() => {
    return systemTheme.value.layout !== "columns";
  });

  return { isHidden };
}

/**
 * 使用底部可见性
 * @param {Object} props - 组件 props
 * @returns {Object} { isHidden }
 */
export function useFooterVisibility(props) {
  const { systemTheme } = storeToRefs(useAppSettings());

  const isHidden = computed(() => {
    const layout = systemTheme.value.layout;
    const showFooter = systemTheme.value.showFooter;

    if (props.isMain) {
      // 主底部：只在 horizontal 布局且开启显示时显示
      return layout !== "horizontal" || !showFooter;
    } else {
      // 非主底部：在非 horizontal 布局且开启显示时显示
      return layout === "horizontal" || !showFooter;
    }
  });

  return { isHidden };
}
